<template>
    <div class="container">
        <h2 class="art-title">定点医院及发热门诊地图权威发布！公众号、小程序、App可直接接入</h2>
        <div class="art-des">2020-01-26</div>
        <div class="art-content">
            <p>国家卫生健康委宣传司联合腾讯健康，发布“新型冠状病毒感染的肺炎医疗救治定点医院和发热门诊地图”。</p>
            <p class="br">为方便服务民众。我们为更多公众号、小程序、App提供绑定此官方服务的指南。</p>
            <p>(若需要h5版本，请发送邮件至 llichen@tencent.com 或 liamzhou@tencent.com, 主题请标注“发热门诊地图”）</p>
            <p class="h1 center">一、公众号</p>
            <p>1.在微信公众平台后台选择小程序管理-添加</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/201-7237e71e9e9c8a716ccbe431a5e54092.jpg" />
            </p>
            <p>2.选择关联小程序</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/202-f8f1da250463d510817aea443a6c66d3.jpg" />
            </p>
            <p>3.扫码登录-关联小程序</p>
            <p>关联小程序的两种方式</p>
            <p>方式1：搜索“腾讯健康”</p>
            <p>方式2：输入Appid：wxb032bc789053daf4</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/203-0f3e63a395609202a0efb8b3bc793c56.jpg" />
            </p>
            <p>4.添加后在自定义菜单或公众号推文中添加链接</p>
            <p>1）自定义菜单：选择跳转小程序-选择腾讯健康-输入小程序路径</p>
            <p>小程序路径：</p>
            <p>
                pages/index/home/main?channel=AAEswZXBJg8_KOYeStL6xKT6&navigate_uri=%2Fpages%2Fwebview%2Fmain%3Fsrc%3Dhttps%253A%252F%252Fsdi.wecity.qq.com%252Fm%252F2020012115185202%252Fmap-landing%253F_scope%253Dsnsapi_base%2526channel%253DAAEswZXBJg8_KOYeStL6xKT6
            </p>
            <p>备用网页（可使用自定链接或使用如下链接）：</p>
            <p>
                https://card.wecity.qq.com/v2/social-insurance/base-info?channel=AAEngZ_b9-g2Na-G2sT6HH4n&cityCode=440300
            </p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/204-705b49be25d88ec2e1d11b75a0ef4f6c.jpg" />
            </p>
            <p>2）推文</p>
            <p>推文上方选择小程序</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/205-003b9a0432ce5033984a07acd236fb63.jpg" />
            </p>
            <p>选择腾讯健康</p>
            <p>或输入小程序appid：wxb032bc789053daf4</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/206-29318667efc50ce076d5592d6e2d97ae.jpg" />
            </p>
            <p>展示方式和文字内容自定</p>
            <p>小程序路径：</p>
            <p>
                pages/index/home/main?channel=AAEswZXBJg8_KOYeStL6xKT6&navigate_uri=%2Fpages%2Fwebview%2Fmain%3Fsrc%3Dhttps%253A%252F%252Fsdi.wecity.qq.com%252Fm%252F2020012115185202%252Fmap-landing%253F_scope%253Dsnsapi_base%2526channel%253DAAEswZXBJg8_KOYeStL6xKT6
            </p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/207-af2db447263741528868a9ce74d2665f.jpg" />
            </p>
            <p class="h1 center">二、小程序</p>
            <p>微信官方接口文档链接：</p>
            <p>
                <a
                    href="https://developers.weixin.qq.com/miniprogram/dev/api/open-api/miniprogram-navigate/wx.navigateToMiniProgram.html"
                    >https://developers.weixin.qq.com/miniprogram/dev/api/open-api/miniprogram-navigate/wx.navigateToMiniProgram.html</a
                >
            </p>
            <p>appId：wxb032bc789053daf4</p>
            <p>
                页面路径path：<br />pages/index/home/main?channel=AAEswZXBJg8_KOYeStL6xKT6&navigate_uri=%2Fpages%2Fwebview%2Fmain%3Fsrc%3Dhttps%253A%252F%252Fsdi.wecity.qq.com%252Fm%252F2020012115185202%252Fmap-landing%253F_scope%253Dsnsapi_base%2526channel%253DAAEswZXBJg8_KOYeStL6xKT6
            </p>
            <p class="h1 center">三、App</p>
            <p>1.登陆微信开放平台，登陆</p>
            <p>https://open.weixin.qq.com</p>
            <p>2.在管理中心中自己的app点击查看</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/208-a8914fb8246aa21737ba7ff50d1d9665.jpg" />
            </p>
            <p>3.关联小程序信息-查看关联</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/209-aa9924f02b195bf96a8581f625a18c8b.jpg" />
            </p>
            <p>4.选择关联小程序</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/210-7f458c297c63569d97989c77d2835b52.jpg" />
            </p>
            <p>5.输入appid：wxb032bc789053daf4</p>
            <p>发送邀请</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/211-30cbd3c1ee6cc91695788d3836a4245f.jpg" />
            </p>
            <p>6.请耐心等待确认，我们会全速通过申请</p>
            <p>如果2小时内我们没有通过，请联系微信号：chenli，zhouweiju107</p>
            <p>如有任何问题，请扫码加入如下群，若群已满，我们会及时更新</p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/212-2715b18ae59fb4a019f33eb16ad20a17.jpg" />
            </p>
            <p class="center">
                <img src="https://static.wecity.qq.com/article-images/213-2715b18ae59fb4a019f33eb16ad20a17.jpg" />
            </p>
            <p>最后，提醒大家勤洗手、少出门、戴口罩。愿大家春节健康平安！</p>
        </div>
    </div>
</template>

<script>
export default {
    components: {},
    data () {
        return {
            dots: []
        }
    },
    async mounted () {
        try {
            await this.initPage()
        } catch (e) {
            console.log('🌟 mounted err: ', e)
        }
    },
    methods: {
        async initPage () {
            document.title = '定点医院及发热门诊地图服务权威发布'
        }
    }
}
</script>

<style lang="scss" scoped>
.container {
    background: #fff;
    padding: 20px;
    .art-title {
        font-size: 18px;
        line-height: 160%;
        font-weight: bold;
    }
    .art-des {
        color: #999;
        line-height: 40px;
    }
    .art-content {
        font-size: 14px;
        p {
            line-height: 160%;
            margin-bottom: 20px;
            text-indent: 2em;
            word-break: break-all;
            &.br {
                margin: 0;
            }
            &.h1 {
                font-size: 16px;
            }
            &.center {
                text-align: center;
                text-indent: 0;
            }
        }
        p img {
            width: 100%;
            // padding: 0 20px;
            box-sizing: border-box;
        }
    }
}
</style>
